<template>
	<view id="WorkOrderReportCompleted">
		<text class="public_item">
			维修类型
			<text>*</text>
		</text>
		<uni-data-select v-model="value" :localdata="range"></uni-data-select>
		<text class="public_item">
			内容描述
			<text>*</text>
		</text>
		<textarea placeholder="300字以内" :maxlength="300" />
		<text class="public_item" @click="Images">
			现场照片
			<text>*</text>
			<view class="images">
				<image :src="items" v-for="(items,indexs) in new_imgs" ></image>
			</view>
		</text>
		<button @click="handlerTiJiao">提交</button>
	</view>
</template>

<script setup>
	import {success} from '@/success/image.js'
	import {
		request
	} from '@/unit/request.js'
	import {
		ref
	} from "vue";
	import {
		onLoad
	} from '@dcloudio/uni-app'
	let value = ref(0)
	const new_imgs=ref([])
	const id=ref()
	onLoad((option) => {
		id.value=option._id
	})
	const Images=()=>{
		success().then(item=>{
			new_imgs.value=[...new_imgs.value,item]
		})
	}
	const handlerTiJiao=()=>{
		request({
			url: "http://42.192.15.126:3000/yan/work_update?id=" + id.value+'&num='+3,
			method: 'PUT',
			data:{'new_imgs':new_imgs.value}
		}).then(item => {
			console.log(item);
			uni.navigateTo({
				url:"/pages/work-order-management/work-order-query/work-order-query"
			})
		})
	}
	let range = [{
			value: 0,
			text: "篮球"
		},
		{
			value: 1,
			text: "足球"
		},
		{
			value: 2,
			text: "游泳"
		}
	]
</script>

<style lang="scss">
	.images{
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		image{
			width: 150rpx;
			height: 150rpx;
		}
	}
	#WorkOrderReportCompleted {
		height: calc(100vh - 44px);
		background-color: #f4f6f9;
		padding-top: 10rpx;
		box-sizing: border-box;

		.public_item {
			position: relative;
			padding-left: 20rpx;
			line-height: 100rpx;
			box-sizing: border-box;

			text {
				position: absolute;
				top: 0;
				right: 0;
				transform: translate(120%, -30%);
				color: red;
			}

			.uni-stat__select {
				background-color: white;
			}

			+textarea {
				width: 100%;
				padding: 30rpx 30rpx;
				background-color: white;
				box-sizing: border-box;
			}

			+.uni-file-picker {
				padding: 0 20rpx;
				box-sizing: border-box;
			}
		}

		button {
			width: 30%;
			color: white;
			background-color: #3366ff;
			margin-top: 50rpx;
		}
	}
</style>